<template>
  <div class="home">
    <!-- 自定义指令 -->
    <!-- <h1 v-wang="123"></h1> -->
    <!-- <div>
      <button v-del="{
        url: '/del1',
        id: 1111
      }">删除1</button>
    </div>

     <div>
      <button v-del="{
        url: '/del2',
        id: 2222
      }">删除2</button>
    </div> -->

    <!-- {{ sex | filterSex | filterSex2 }} -->

    <!-- <Min/> -->

    <!-- props  -->
    <!-- <Slott> -->
      <!-- <h2 slot="aaa">默认111</h2>
      <h2 slot="bbb">默认222</h2> -->

       <!-- <template slot="aaa" slot-scope="obj">
          <h2 >默认222--{{ obj.title }}</h2>
      </template> -->

      <!-- <template v-slot:aaa="obj">
          <h2 slot="aaa">默认222--{{ obj.title }}</h2>
      </template> -->
    <!-- </Slott> -->
  </div>
</template>

<script>
import axios from "axios";
import Min from "../components/Min.vue";
import Slott from "../components/Slot.vue";
export default {
  name: "Home",
  data() {
    return {
      sex: 1,
    };
  },
  components: {
    Min,
    Slott,
  },
  filters: {
    filterSex(sex) {
      return sex === 1 ? "男" : "女";
    },
    filterSex2(sex) {
      return sex === "男" ? "男男男" : "111111111";
    },
  },
  created() {
    try {
      localStorage.setItem('aa', [1, 2, 3, 4])
    } catch {
      console.log('aa')
    }
  }

  // directives: {
  //   wang(el, option) {
  //     // el  当前元素
  //     // option
  //     el.innerHTML = option.value
  //     console.log(option)
  //   },
  //   del: {
  //     inserted(el, option) {
  //       el.addEventListener('click', () => {
  //         axios.get(option.value.url).then(res => {
  //             console.log('我传递的参数是', option.value.id )
  //         })
  //       })
  //     }
  //   }
  // }
};
</script>
